{extend name='public/base' /}
{block name="css"}

{/block}
{block name="content"}
<div class="layui-card">
    <div class="layui-card-body">
        <!-- 表格工具栏 -->
        <form class="layui-form toolbar">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">类型名称:</label>
                    <div class="layui-input-inline">
                        <input name="name" class="layui-input" placeholder="请输入类型名称"/>
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">类型编码:</label>
                    <div class="layui-input-inline">
                        <input name="code" class="layui-input" placeholder="请输入类型编码"/>
                    </div>
                </div>
                <div class="layui-inline">&emsp;
                    <button class="layui-btn icon-btn" lay-filter="tableSearch" lay-submit>
                        <i class="layui-icon">&#xe615;</i>搜索
                    </button>
                </div>
                <div class="layui-inline">&emsp;
                    <button type="reset" class="layui-btn layui-btn-primary icon-btn">
                        <i class="layui-icon">&#xe669;</i>重置
                    </button>
                </div>
            </div>
        </form>
        <!-- 数据表格 -->
        <table id="dataTable" lay-filter="dataTable"></table>
    </div>
</div>
{/block}
{block name="js"}
<!-- 表格操作列 -->
<script type="text/html" id="tableBar">
    <a class="layui-btn layui-btn-primary layui-btn-xs" perm-show="sysDictType:edit" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" perm-show="sysDictType:delete" lay-event="delete">删除</a>
    <a class="layui-btn layui-btn-xs" perm-show="sysDictData:page" lay-event="page">字典</a>
</script>

<!-- js部分 -->
<script>
    layui.use(['layer', 'table', 'tableX', 'notice', 'xnUtil'], function () {
        var $ = layui.jquery;
        var layer = layui.layer;
        var table = layui.table;
        var tableX = layui.tableX;
        var admin = layui.admin;
        var form = layui.form;
        var notice = layui.notice;
        var xnUtil = layui.xnUtil;

        /* 渲染表格 */
        var insTb = tableX.render({
            elem: '#dataTable',
            url: 'page',
            page: true,
            toolbar: ['<p>',
                '<button lay-event="add" perm-show="sysDictType:add" class="layui-btn layui-btn-sm icon-btn"><i class="layui-icon">&#xe654;</i>添加</button>&nbsp;',
                '<button lay-event="delete" perm-show="sysDictType:delete" class="layui-btn layui-btn-sm layui-btn-danger icon-btn"><i class="layui-icon">&#xe640;</i>删除</button>',
                '</p>'].join(''),
            cellMinWidth: 100,
            cols: [
                [
                    {type: 'checkbox'},
                    {field: 'id', title: 'id', hide:true, sort: true},
                    {field: 'name', title: '类型名称', sort: true},
                    {field: 'code', title: '类型编码', sort: true},
                    {field: 'sort', title: '排序', sort: true},
                    {field: 'remark', title: '备注', sort: true},
                    {field: 'status', title: '状态', sort: true, templet: function (d) {  return xnUtil.rendDataTableDict(d.status, 'common_status'); } },
                    {field: 'createUserName', title: '创建人', hide:true},
                    {field: 'createDate', title: '创建日期', hide:true, sort: true, minWidth: 120},
                    {field: 'updateUserName', title: '更新人', hide:true},
                    {field: 'updateDate', title: '更新日期', hide:true, sort: true, minWidth: 120},
                    {title: '操作', toolbar: '#tableBar', align: 'left', minWidth: 180}
                ]
            ],
            done: function(res, curr, count) {
                xnUtil.tableDone(insTb, res, curr, count);
            }
        });

        /* 表格搜索 */
        form.on('submit(tableSearch)', function (data) {
            insTb.reload({where: data.field, page: {curr: 1}});
            return false;
        });

        /* 表格工具条点击事件 */
        table.on('tool(dataTable)', function (obj) {
            /* 删除 */
            if (obj.event === 'delete') {
                xnUtil.tabDelete(insTb, obj.data.id);
            }
            /* 编辑 */
            if (obj.event === 'edit') {
                xnUtil.showUpdateModel(insTb, '字典类型', obj.data);
            }
            /* 获取字典 */
            if (obj.event === 'page') {
                admin.putTempData('queryDictTypeId', obj.data.id);
                window.location.href = '/admin/dict_data/index';
            }
        });

        /* 表格头工具栏点击事件 */
        table.on('toolbar(dataTable)', function (obj) {
            if (obj.event === 'add') { // 添加
                xnUtil.showAddModel(insTb, '字典类型');
            }
            if (obj.event === 'delete') { // 删除
                xnUtil.tabDelete(insTb);;
            }
        });
    });
</script>
{/block}